<script  language="javascript" type="text/javascript">
    function CheckPass() {
        var pass = document.getElementById("txtPasscl").value;
        var repass = document.getElementById("txtRePasscl").value;
        if (pass !== repass)
        {
            alert("Confirm password must match password!");
            document.getElementById("txtRePasscl").value = '';
        }
    }
</script>
<section id="content" class="gray-area">
    <div class="container car-detail-page">
        <div class="row">
            <div id="main" class="col-md-9">
                <div class="tab-container">
                    <ul class="tabs">
                        <li class="active">
                            <a  data-toggle="tab">Register</a>
                        </li>
                    </ul>
                    <div class="tab-content">
                        <div style="min-height: 500px; " class="tab-pane fade in active" id="car-details">
                            <form action="../RegisterPR" method="post" name="frmLogin">
                                <table border='0'style="font-size: 16px; margin-left: 100px;" >
                                    <tr>
                                        <td height="40" width='20%'> &nbsp;</td>
                                        <td> &nbsp;</td>
                                    </tr>
                                    <tr>
                                        <td height="40" width='20%'>Fullname: &nbsp;&nbsp;</td>
                                        <td><input type="text" style="width: 200px; height: 30px; background: #f5f5f5; border: #ccc 1px solid;" required name="txtFullnamecl" /></td>
                                    </tr>
                                    <tr>
                                        <td height="40" width='20%'>Username: &nbsp;&nbsp;</td>
                                        <td><input type="text" style="width: 200px; height: 30px; background: #f5f5f5; border: #ccc 1px solid;" required name="txtUsernamecl" /></td>
                                    </tr>
                                    <tr>
                                        <td height="40" width='20%'>Password:&nbsp;&nbsp;</td>
                                        <td><input type="password" style="width: 200px; height: 30px; background: #f5f5f5; border: #ccc 1px solid;" required id="txtPasscl" name="txtPasscl"/></td>
                                    </tr>
                                    <tr>
                                        <td height="40" width='20%'>Confirm Password:&nbsp;&nbsp;</td>
                                        <td><input type="password" onchange="CheckPass();" style="width: 200px; height: 30px; background: #f5f5f5; border: #ccc 1px solid;" required id="txtRePasscl" name="txtRePasscl"/></td>
                                    </tr>
                                    <tr>
                                        <td height="40" width='20%'>Email: &nbsp;&nbsp;</td>
                                        <td><input type="email" style="width: 250px; height: 30px; background: #f5f5f5; border: #ccc 1px solid;" required name="txtEmailcl" /></td>
                                    </tr>
                                    <tr>
                                        <td height="40" width='20%'>Telephone: &nbsp;&nbsp;</td>
                                        <td><input type="number" style="width: 200px; height: 30px; background: #f5f5f5; border: #ccc 1px solid;" required name="txtPhonecl" /></td>
                                    </tr>
                                    <tr>
                                        <td height="40" width='20%'>Gender: &nbsp;&nbsp;</td>
                                        <td>
                                            <select name="txtgendercl" class="txtgender">
                                                out.print("<option value='1'>Male</option>");
                                                out.print("<option value='2'>Female</option>");
                                            </select>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td height="40" width='20%'>Address: &nbsp;&nbsp;</td>
                                        <td><textarea required rows="5" style="width: 400px" name="txtAddresscl"></textarea></td>
                                    </tr>
                                    <tr>
                                        <td height="40" width='20%'>Birthday: &nbsp;&nbsp;</td>
                                        <td><input type="date" style="width: 200px; height: 30px; background: #f5f5f5; border: #ccc 1px solid;" required name="txtBirthdaycl" /></td>
                                    </tr>

                                    <tr>
                                        <td height="40" width='20%'>&nbsp;</td>
                                        <td>&nbsp;</td>
                                    </tr>
                                    <tr>
                                        <td height="40" width='20%'>&nbsp;</td>
                                        <td><input type='submit' required style='background:  #00A8FF; border: none; width: 120px; height: 40px; color: #fff;' value='Register' name='btnRegister'/></td>
                                    </tr>
                                </table>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
            <jsp:include page="menu-right.jsp" />
        </div>
    </div>
</section>